<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="admin/common/common_css :: commonHeader('添加视频')">
</head>
<link rel="stylesheet" th:href="@{/js/admin.ui/lib/zTree/v3/css/metroStyle/metroStyle.css}" type="text/css">
<body>
<article class="page-container">
    <form class="form form-horizontal" id="form-knowledge-type-add">
        <input type="hidden" id="newName"/>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>名称：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" placeholder="名称（必填）" id="videoName" name="videoName" maxlength="50" />
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>描述：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <textarea id="videoDesc" name="videoDesc" maxlength="200" class="textarea"  placeholder="描述内容...200个字符以内" onKeyUp="javascript:textareaLength(this);"></textarea>
                <p class="textarea-numberbar"><em class="textarea-length"><span id="textareaLengthSpan">0</span></em>/200</p>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>展示图片：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="file" class="input-text" placeholder="展示图片（必填）" id="videoPic" name="videoPic"/>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>视频：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="file" class="input-text" placeholder="视频（必填）" id="video" name="video"/>
            </div>
        </div>

        <div class="row cl">
            <div style="text-align: center;">
                <button class="btn btn-primary radius" type="button" onclick="add();">
                    <i class="Hui-iconfont">&#xe632;</i> 保存
                </button>
                &nbsp;&nbsp;
                <button onClick="layer_close();" class="btn btn-default radius" type="button">
                    &nbsp;&nbsp;取消&nbsp;&nbsp;
                </button>
            </div>
        </div>
    </form>
</article>
<div th:include="admin/common/common_js :: onLoadJS"></div>
<script type="text/javascript" th:src="@{/js/admin.ui/lib/jquery.validation/1.14.0/jquery.validate.js}"></script>
<script type="text/javascript" th:src="@{/js/admin.ui/lib/jquery.validation/1.14.0/validate-methods.js}"></script>
<script type="text/javascript" th:src="@{/js/admin.ui/lib/jquery.validation/1.14.0/messages_zh.js}"></script>
<script type="text/javascript" th:src="@{/js/admin.ui/lib/zTree/v3/js/jquery.ztree.all-3.5.min.js}"></script>
<script type="text/javascript" th:src="@{/js/user/myUpload.js}"></script>
<script type="text/javascript" th:inline="javascript">

    function add() {
        var videoName = $("#videoName").val();
        var videoDesc = $("#videoDesc").val();
        if(videoName == ""){
            layer.msg('请输入名称', {icon: 2});
            return false;
        }else if(videoDesc == ""){
            layer.msg('请输入描述', {icon: 2});
            return false;
        }else if(document.getElementById("videoPic").value.length == 0){
            layer.msg('请上传展示图片', {icon: 2});
            return false;
        }else if(document.getElementById("video").value.length == 0){
            layer.msg('请上传视频', {icon: 2});
            return false;
        }
        var formData = new FormData();
        formData.append("videoName", videoName);
        formData.append("videoDesc", videoDesc);
        formData.append("newName", $("#newName").val());
        formData.append("pic",document.getElementById("videoPic").files[0]);
        send2(
            "/pestdiagnosis/sys/pest/addVideo",
            formData,
            function (data) {
                layer.msg(data.message, {icon: 1,time: 1500}, function() {
                    window.parent.location.href = "/pestdiagnosis/sys/pest/toListVideo";
                });
            },
            function (res) {
                layer.msg('网络异常，请稍后再试', {icon: 2});
            }
        );
    }
    // 计算文本域字符长度
    function textareaLength(obj) {
        $('#textareaLengthSpan').text($(obj).val().length);
    }
</script>
</body>
</html>